<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>鲸飞网络科技有限公司-客服管理系统</title>
		<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
		<link rel="stylesheet" href="admin.css" />
		<script src="https://unpkg.com/vue/dist/vue.js"></script>
	    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
	</head>
	<body class="admin">
		<div id="app">
			<div class="admin_title">客服管理系统</div>
			<div class="admin_area">
				<div class="admin_line">
					<el-input placeholder="请输入用户名" v-model="username">
					   <template slot="prepend">用户名</template>
					</el-input>
				</div>
				<div class="admin_line">
					<el-input maxlength="6" type="password" placeholder="请输入密码" v-model="passwd">
					   <template slot="prepend">密码</template>
					</el-input>
				</div>
				<div class="admin_line">
					<el-button @click="loginClick" type="primary">登录</el-button>
				</div>
			</div>
			<div class="tigong">©️鲸飞网络科技有限公司</div>
		</div>
	</body>
	<script>
	  var app = new Vue({
	      el: '#app',
	      data: {
	        username: '', // 用户名
	        passwd: '',   // 密码
	        defaultInfo: {
	        		username: 'admin',
	        		passwd: '123456'
	        }
	      },
	      methods: {
	      	// 登录按钮点击事件
	      	loginClick: function(){
	      		if (this.username == '' || this.username != this.defaultInfo.username) {
	      			this.$message({
			          showClose: true,
			          message: '请输入正确的用户名',
			          type: 'warning'
			        });
			        return;
	      		}
	      		if (this.passwd == '' || this.passwd != this.defaultInfo.passwd) {
	      			this.$message({
			          showClose: true,
			          message: '请输入正确的密码',
			          type: 'warning'
			        });
			        return;
	      		}
	      		window.location.href = 'list.html'
	      	}
	      }
	  })
	</script>
</html>
